import 'package:flower_flutter/ExpansionTilePage.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class ExpansionPanelListPage extends StatefulWidget {
  @override
  ExpansionPanelListPageState createState() =>
      new ExpansionPanelListPageState();
}

class ExpansionPanelListPageState extends State<ExpansionPanelListPage> {
  static const CITY_NAMES = {
    '北京': ['东城区', '西城区', '海淀区', '朝阳区', '石景山区', '顺义区'],
    '上海': ['黄浦区', '徐汇区', '长宁区', '静安区', '普陀区', '闸北区'],
    '广州': ['越秀', '海珠', '荔湾', '天河', '白云', '黄埔', '南沙'],
    '深圳': ['南山', '福田', '罗湖', '盐田', '龙岗', '宝安', '龙华'],
    '杭州': ['上城区', '下城区', '江干区', '拱墅区', '西湖区', '滨江区'],
    '苏州': ['姑苏区', '吴中区', '相城区', '高新区', '虎丘区', '工业园区', '吴江区'],
    '苏州1': ['姑苏区', '吴中区', '相城区', '高新区', '虎丘区', '工业园区', '吴江区'],
    '苏州2': ['姑苏区', '吴中区', '相城区', '高新区', '虎丘区', '工业园区', '吴江区'],
    '苏州3': ['姑苏区', '吴中区', '相城区', '高新区', '虎丘区', '工业园区', '吴江区'],
    '苏州4': ['姑苏区', '吴中区', '相城区', '高新区', '虎丘区', '工业园区', '吴江区'],
    '苏州5': ['姑苏区', '吴中区', '相城区', '高新区', '虎丘区', '工业园区', '吴江区'],
    '苏州6': ['姑苏区', '吴中区', '相城区', '高新区', '虎丘区', '工业园区', '吴江区'],
    '苏州7': ['姑苏区', '吴中区', '相城区', '高新区', '虎丘区', '工业园区', '吴江区'],
  };
  static const PickerData = [
    {
      "a1": ["1", "2", "3", "4"]
    },
    {
      "a2": ["5", "6", "7", "8"]
    },
    {
      "a3": ["9", "10", "11", "12"]
    }
  ];

  Map<String, List<String>> map = {};
  List<String> keyList = [];
  int _panelIndex=-1;
  @override
  void initState() {
    super.initState();

    ///转为map
    CITY_NAMES.keys.forEach((key) {
      keyList.add(key);
      List<String> list = [];
      list.addAll(CITY_NAMES[key]);
      map[key] = list;
      print(map[key]);
    });
    print(map);
  }

  @override
  Widget build(BuildContext context) {
    ///点击展开收起未实现，如果要实现，可以查看这个链接
    ///https://learnku.com/articles/31574
    return Scaffold(
        appBar: AppBar(
          title: Text(''),
        ),
        body: SingleChildScrollView(
          child: ExpansionPanelList(
            elevation: 0,
            expansionCallback: (panelIndex, isExpand) {
              print(panelIndex);
              setState(() {
                _panelIndex= _panelIndex==panelIndex?-1:panelIndex;
              });
            },
            children: keyList.map((e) {
                  return ExpansionPanel(
                  canTapOnHeader: true,
                  isExpanded: true,
                  headerBuilder: (ctx, isExpand) {
                    return ListTile(title: Text(e));
                  },
                  body: Container(
                    height: 200,
                    padding: EdgeInsets.symmetric(horizontal: 5.0),
                    child: new GridView.builder(
                        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                            crossAxisCount: 4,
                            mainAxisSpacing: 1,
                            crossAxisSpacing: 1,
                            childAspectRatio: 1.2
                        ),
                        itemCount: map[e].length,
                        itemBuilder: (BuildContext context, int position) {
                          return subTitle(map[e][position]);
                        }),
                  ));
            }).toList(),
          ),
        ));
  }
}
